<template>
  <el-row id="unit-setting-container">
    <el-row v-if="!isViewShow" class="permission">
      没有权限!
    </el-row>
    <el-card v-else class="box-card">
      <div slot="header" class="clearfix">
        <span>单位基础信息</span>
        <el-button :disabled="!isViewEdit" @click="editHandler" style="float: right; padding: 6px 6px;margin-right: 10px" type="primary">编辑<i class="el-icon-edit el-icon--right"></i></el-button>
      </div>

      <el-form :model="companyInfo" label-width="190px" :rules="rules" >
        <el-row>
          <el-col :span="6">
            <el-form-item label="所属地区">
              <el-input :disabled="forbidden" v-model="companyInfo.administrativeArea"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-tooltip class="item" effect="dark" content="（按照 GB/T 4754 规定编码填写）" placement="top">
              <el-form-item label="所属行业" prop="trade">
                <el-input :disabled="forbidden" v-model="companyInfo.trade"></el-input>
              </el-form-item>
            </el-tooltip>
          </el-col>
          <el-col :span="6">
            <el-tooltip class="item" effect="dark" content="（包括以下五类：工业，交通运输、仓储和邮政业，住宿和餐饮业，批发和零售业，教育。）" placement="top">
              <el-form-item label="所属领域">
                <el-select :disabled="forbidden" v-model="companyInfo.field" placeholder="请选择">
                  <el-option
                    v-for="item in fields"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-tooltip>
          </el-col>
          <el-col :span="6">
            <el-form-item label="单位类型"  prop="category">
              <el-input :disabled="forbidden" v-model="companyInfo.category"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="单位详细名称" prop="name">
              <el-input :disabled="forbidden" v-model="companyInfo.name"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="社会信用代码"  prop="socialCreditCode">
              <el-input :disabled="forbidden" v-model="companyInfo.socialCreditCode"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="单位注册日期">
              <!--<el-input v-model="companyInfo.registerDate" placeholder="格式:0000-00-00"></el-input>-->
              <el-date-picker
                :disabled="forbidden"
                value-format="yyyy-MM-dd"
                v-model="companyInfo.registerDate"
                type="date"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="单位注册资本(万元)">
              <el-input :disabled="forbidden" v-model="companyInfo.registerCapital"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="法定代表人姓名">
              <el-input :disabled="forbidden" v-model="companyInfo.legalPerson"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="法定人联系电话(区号)">
              <el-input :disabled="forbidden" v-model="companyInfo.legalTelephone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="是否央企" prop="isCentralEnterprises">
             <!-- <el-input v-model="formatStatus1"></el-input>-->
              <el-select :disabled="forbidden" v-model="companyInfo.isCentralEnterprises" placeholder="请选择">
                <el-option
                  v-for="item in centralFields"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="所属集团名称">
              <el-input :disabled="forbidden" v-model="companyInfo.blocName"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="单位地址">
              <el-input :disabled="forbidden" v-model="companyInfo.address"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="邮政编码">
              <el-input :disabled="forbidden" v-model="companyInfo.zipCode"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="行政区划代码">
              <el-input :disabled="forbidden" v-model="companyInfo.administrativeCode"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="电子邮箱">
              <el-input :disabled="forbidden" v-model="companyInfo.emailAddress"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="能源管理机构名称">
              <el-input :disabled="forbidden" v-model="companyInfo.energyAdministrativeInstitution"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="传真(区号)">
              <el-input :disabled="forbidden" v-model="companyInfo.fax"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="主管节能领导姓名">
              <el-input :disabled="forbidden" v-model="companyInfo.directorName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="主管联系电话(区号)">
              <el-input :disabled="forbidden" v-model="companyInfo.directorTelephone"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="主管节能领导职务">
              <el-input :disabled="forbidden" v-model="companyInfo.directorDuty"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="能耗监测负责人">
              <el-input :disabled="forbidden" v-model="companyInfo.monitorPrincipal"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="能耗监测负责人手机">
              <el-input :disabled="forbidden" v-model="companyInfo.monitorPrincipalMobile"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="能源管理负责人">
              <el-input :disabled="forbidden" v-model="companyInfo.managePrincipal"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="能源管理负责人手机">
              <el-input :disabled="forbidden" v-model="companyInfo.managePrincipalMobile"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="是否通过能源管理体系认证">
             <!-- <el-input v-model="formatStatus2"></el-input>-->
              <el-select :disabled="forbidden" v-model="companyInfo.isAuthentication" placeholder="请选择">
                <el-option
                  v-for="item in authenticationFields"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="通过日期" >
              <!--<el-input  placeholder="格式:0000-00-00" v-model="companyInfo.authenticationDate"></el-input>-->
              <el-date-picker
                :disabled="forbidden"
                value-format="yyyy-MM-dd"
                v-model="companyInfo.authenticationDate"
                type="date"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="认证机构">
              <el-input :disabled="forbidden" v-model="companyInfo.authenticationInstitution"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="单位地址经度" prop="longitude">
              <el-input :disabled="forbidden"  v-model="companyInfo.longitude"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="单位地址纬度" prop="latitude">
              <el-input :disabled="forbidden" v-model="companyInfo.latitude"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="6">
            <el-form-item label="企业主要生产线名称">
              <el-input
                :disabled="forbidden"
                type="textarea"
                :rows="4"
                v-model="companyInfo.majorProductionLine"
                placeholder="请输入内容">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="企业主导产品">
              <el-input
                :disabled="forbidden"
                type="textarea"
                :rows="4"
                v-model="companyInfo.majorProduct"
                placeholder="请输入内容">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="其它情况">
              <el-input
                :disabled="forbidden"
                type="textarea"
                v-model="companyInfo.other"
                :rows="4"
                placeholder="请输入内容">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex" class="usc-submit-layout" v-show="isShowBottom">

          <el-button @click="cancelSubmit">取消</el-button>
          <el-button @click="submitHandler" type="primary">确定</el-button>

        </el-row>


      </el-form>

    </el-card>

  </el-row>
</template>

<script>
    export default {
        name: "index",
        data(){
          return {
            isViewShow: false,
            isViewEdit: false,
            companyInfo:{
              id: "7b43316d6bdd45d64fabc31a0b077066",
              name: "",
              field: '',
              trade: "",
              socialCreditCode: "",
              administrativeArea: "",
              province: "",
              city: "",
              country: "",
              town: "",
              registerDate: "",
              registerCapital: 0,
              registeredAddress: "",
              address: "",
              zipCode: "",
              legalPerson: "",
              legalTelephone: "",
              emailAddress: "",
              isCentralEnterprises: '',
              blocName: "",
              administrativeCode: "",
              energyAdministrativeInstitution: "",
              fax: "",
              directorName: "",
              directorTelephone: "",
              directorDuty: "",
              shortName: "",
              picUrl: "",
              liveUrl: "",
              monitorPrincipal: "",
              monitorPrincipalMobile: "",
              managePrincipal: "",
              managePrincipalMobile: "",
              isAuthentication: '',
              authenticationInstitution: "",
              longitude: "",
              latitude: "",
              majorProductionLine: "",
              majorProduct: "",
              other: "",
              category: ""
            },
            isShowBottom: false,
            forbidden:true,
            rules:{
              trade:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              category:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              name:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              socialCreditCode:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              isCentralEnterprises:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              longitude:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              latitude:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
            },
            fields:[{value: 1,label: '工业'},{value: 2,label: '交通运输,仓储和邮政业'},{value: 3,label: '住宿和餐饮业'},{value:4,label: '批发和零售业'},{value: 5,label: '教育'}],
            centralFields:[{value: 1,label: '是'},{value: 0,label: '否'}],
            authenticationFields:[{value: 1,label: '是'},{value: 0,label: '否'}],
          }
        },
      created() {
        this.$emit('fixHeadIndex', "2")
      },
        mounted(){
          let obj = this.validateGlobal.getPermission(2)
          this.isViewShow = obj.isViewShow
          this.isViewEdit = obj.isViewEdit
          this.askDatas()
        },
        computed:{
          formatStatus1: function () {
            return this.companyInfo.isCentralEnterprises==1 ? '是' : this.companyInfo.isCentralEnterprises == 0 ? '否' : ''
          },
          formatStatus2: function () {
            return this.companyInfo.isAuthentication==1 ? '是' : this.companyInfo.isAuthentication == 0 ? '否' : ''
          }
        },
        methods:{
          submitHandler: function(){
            let _that = this
            let userId = sessionStorage.getItem("userId")
            let url = _that.ports.company.edit + "?userId=" + userId
            let askData = _that.companyInfo
            this.http.post(url,askData, res => {
              if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
                _that.$message('提交成功!');
                this.isShowBottom = false
                this.forbidden = true
                this.askDatas()
              }else{
                _that.$message('提交失败!');
              }
              console.log("CompanyEdit",res)
            })
          },
          editHandler: function(){
            this.forbidden = false
            if (!this.isShowBottom) {
              this.isShowBottom = true
            }
          },
          cancelSubmit: function(){
            this.forbidden = true
            if (this.isShowBottom) {
              this.isShowBottom = false
            }
          },
          askDatas: function () {
            let _that = this
            let userId = sessionStorage.getItem("userId")
            let url = _that.ports.company.info
            let askData = {
              userId: userId
            }
            this.http.get(url,askData, res => {
              if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
                _that.doDatas(res.data)
              }else{
                _that.$message('error!');
              }

            })
          },
          doDatas: function (datas) {
            console.log("CompanyInfo",datas)
            this.companyInfo = datas
          }

        },

      /*  filters: {
          // 状态过滤
          formatStatus(val) {
            this.$message(val);

          },
        }*/
    }
</script>

<style lang="scss">

  #unit-setting-container {

    .el-card{
      margin: 20px 20px 0 20px;
      height: 820px;
    }
    .usc-submit-layout{
      justify-content: center;
    }
    .el-select{
     width: 270px;
    }
    .el-date-editor.el-input, .el-date-editor.el-input__inner {
      width: 270px;
    }
  }

</style>
